<template>
	<view class="center">
		<view class="logo" @click="toUserinfo" hover-class="logo-hover">
			<image class="logo-img" :src="avatarUrl" @click="takePhoto"></image>
			<view class="logo-title" style="width:100%">
				<text class="uer-name">Hi，{{uerInfo.userName}}</text>
				<text class="go-login navigat-arrow">&#xe600;</text>
			</view>
			<!-- <view class="">
				<text class="uer-name">15868129300</text>
			</view> -->
		</view>
		<view class="center-list">
			<view class="center-list-item border-bottom" @click="testList('doing')">
				<text class="list-icon">&#xe60d;</text>
				<text class="list-text">等待检测</text>
				<text class="navigat-arrow">&#xe600;</text>
			</view>
			<view class="center-list-item" @click="testList('my')">
				<text class="list-icon">&#xe625;</text>
				<text class="list-text">我的申请</text>
				<text class="navigat-arrow">&#xe600;</text>
			</view>
		</view>
		<view class="center-list">
			<view class="center-list-item border-bottom" @click="testList('bohui')">
				<text class="list-icon">&#xe683;</text>
				<text class="list-text">驳回申请</text>
				<text class="navigat-arrow">&#xe600;</text>
			</view>
			<view class="center-list-item" @click="testList('finish')">
				<text class="list-icon">&#xe623;</text>
				<text class="list-text">完成检测</text>
				<text class="navigat-arrow">&#xe600;</text>
			</view>
		</view>
		<view class="center-list">
			<view class="center-list-item">
				<text class="list-icon">&#xe624;</text>
				<text class="list-text">联系客服</text>
				<text class="navigat-arrow">&#xe600;</text>
			</view>
		</view>
		<view class="center-list">
			<view class="center-list-item" @click="logout()">
				<text class="list-icon">&#xe74d;</text>
				<text class="list-text">退出登录</text>
				<text class="navigat-arrow">&#xe600;</text>
			</view>
		</view>
	</view>
</template>

<script>
	import api from '../../api.js';
	var util = require('../../common/util.js');
	export default {
		data() {
			return {
				version: '',
				login: api.login(),
				avatarUrl: "../../static/profile.png",
				uerInfo: uni.getStorageSync('user')
			}
		},
		onLoad() {
			this.version = plus.runtime.version;
			if(this.uerInfo.img)
				this.avatarUrl=api.HOST+"/core/file/download/" +this.uerInfo.img
		},
		methods: {
			logout(){
				try {
					uni.clearStorageSync();
				} catch (e) {
				}
				uni.reLaunch({
					url: '/pages/login/login'
				})
			},
			testList(type) {
				uni.navigateTo({
					url: '/pages/jiance/list?type='+type
				});
			},
			toUserinfo() {
				uni.navigateTo({
					url: '/pages/profile/updateInfo'
				});
			},takePhoto() {
				let _this = this;
				util.imgHandle.chooseImage(1, ['compressed'], ['camera']).then(function(res) {
					uni.showLoading({
						title: '上传中',
						mask:true
					});
                    _this.imgSrc = res;
					api.uploadFile({
						url:'core/file/uploadAttachment.json',
						filePath: res,
						name: 'file',
						success: (data) => {
							uni.hideLoading();
							if(data.code==0){
								_this.avatarUrl = res;
								_this.attach_id=data.data.id;
							}else{
								uni.showToast({
									icon: 'none',
									title: '上传失败，请重新上传'
								});
							}
						}
					})
					//return util.imgHandle.saveImageToPhotosAlbum(res); //保存到本地相册
				}).then(function(res) {
					//console.log('保存到本地相册成功');
				}).catch(function(err) {
				})
			}
		}
	}
</script>

<style>
	@font-face {
		font-family: texticons;
		font-weight: normal;
		font-style: normal;
		src: url('https://at.alicdn.com/t/font_1101749_8y8jgcap5u3.ttf') format('truetype');
	}

	page,
	view {
		display: flex;
	}

	page {
		background-color: #f8f8f8;
	}

	.center {
		flex-direction: column;
		width: 100%;
	}

	.logo {
		width: 100%;
		height: 240upx;
		padding: 20upx;
		box-sizing: border-box;
		background-color: #1E90FF;
		flex-direction: row;
		align-items: center;
	}

	.logo-hover {
		opacity: 0.8;
	}

	.logo-img {
		width: 100px;
		height: 100px;
		border-radius: 100px;
	}

	.logo-title {
		height: 150upx;
		flex: 1;
		align-items: center;
		justify-content: space-between;
		flex-direction: row;
		margin-left: 20upx;
	}

	.uer-name {
		height: 60upx;
		line-height: 60upx;
		font-size: 18px;
		color: #FFFFFF;
	}

	.go-login.navigat-arrow {
		
		font-size: 18px;
		color: #FFFFFF;
	}

	.login-title {
		height: 150upx;
		align-items: self-start;
		justify-content: center;
		flex-direction: column;
		margin-left: 20upx;
	}

	.center-list {
		width: 100%;
		background-color: #FFFFFF;
		margin-top: 20upx;
		flex-direction: column;
	}

	.center-list-item {
		height: 110upx;
		width: 100%;
		box-sizing: border-box;
		flex-direction: row;
		padding: 0upx 20upx;
	}

	.border-bottom {
		border-bottom-width: 1upx;
		border-color: #c8c7cc;
		border-bottom-style: solid;
	}

	.list-icon {
		width: 40upx;
		height: 90upx;
		line-height: 90upx;
		font-size: 25px;
		color: #1E90FF;
		text-align: center;
		font-family: texticons;
		margin-right: 20upx;
	}

	.list-text {
		height: 90upx;
		line-height: 90upx;
		font-size: 18px;
		color: #555;
		flex: 1;
		text-align: left;
	}

	.navigat-arrow {
		height: 90upx;
		width: 40upx;
		line-height: 90upx;
		
		font-size: 18px;
		color: #555;
		text-align: right;
		font-family: texticons;
	}
</style>